<template>
    <view class="coming_online_soon">
        <view class="title">即将上线</view>
        <view class="content">
            <view class="card" style="background-image: url('https://lottery.yywlcm.com/upload/h5/home/9.png')">
                <p>34天开始抽</p>
                <p>34天开始抽</p>
                <view class="remind_btn">
                    <image src="https://lottery.yywlcm.com/upload/h5/home/5.png"></image>
                    提醒我
                </view>
            </view>
        </view>
    </view>
</template>
<script>
export default {
}
</script>
<style lang="scss" scoped>
.coming_online_soon {
    margin-top: 20rpx;
    border-radius: 30rpx;
    background-color: #fff;
    .title {
        font-size: 38rpx;
        font-weight: bold;
        padding: 30rpx;
        border-bottom: 1px solid #CBCBCB;
    }
    .content {
        .card {
            position: relative;
            padding: 20rpx;
            background-size: 100% 100%;
            p {
                line-height: 60rpx;
            }
            
            .remind_btn {
                color: #fff;
                position: absolute;
                bottom: 15%;
                right: 5%;
                background: linear-gradient(180deg, #148DFF 0%, #6CC3FF 100%);
                padding: 10rpx 20rpx;
                border-radius: 30rpx;
                font-size: 26rpx;
                image {
                    width: 30rpx;
                    height: 30rpx;
                    vertical-align: middle;
                    margin-right: 10rpx;
                    position: relative;
                    top: -5rpx;
                }
            }
        }
    }
}
</style>